<template>
    <div class="themeTitle">
      <div class="titleWord">
        {{titles}}
      </div>
      <div class="bg"></div>
      <div class="bottom"></div>
    </div>
</template>

<script>

export default {
    props:{
        titles:String,
        ImgSrc:String
    },
    setup(){
        return {
            
        }
    }
    
}
</script>
<style lang="stylus" scoped>

  @media (max-width: 2880px)
    .themeTitle
        background: url('/images/sjzx/title.png') no-repeat
        background-size:100% 100%
        height:vh(26)
        width:vw(344)
        .titleWord
            letter-spacing :vw(1)
            font-size:vw(16)
            height:vh(26)
            line-height:vh(10)
</style>
<style lang="stylus" scoped>

  @media (min-width: 3000px)
    .themeTitle
        width:100%
        // height:vh(37)
        background-repeat: no-repeat
        background-position:bottom left
        .titleWord
            letter-spacing :vw1(1)
            font-size:$f22
            text-shadow:2px 2px 4px #fff;
        .bg{
          height:vh(15)
          background: url('/images/sjzx/titleBg.png') no-repeat
          background-size:100% 100%
        }
        .bottom{
          height:vh(20)  
        }
</style>